@charset "UTF-8";
.login {
  width: 100vw;
  height: 100vh;
  background-image: url("~assets/images/login.png");
  background-size: cover;
  position: relative;
}

.login :global .login-container {
  position: absolute;
  width: 440px;
  height: 360px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.login :global .login-logo {
  width: 200px;
  height: 60px;
  display: block;
  margin: 0 auto 20px;
}

/**
如果被:global包裹的类名，代表全局类名，就不会被css-modules处理
.aa :global(.iconfont){}

:global 包裹的类型是全局的类型，不会被css modules转义

vue里面的类名冲突是靠scoped解决的而react则是在css文件后加
index.module.css文件后缀，这样可以解决类名冲突
本意也是模块的意思，原理是改变了原有的类名随机字符，
这样也有坏处，就是改变全局类名的时候会改变他的类名导致无法更改样式
解决方法就是加一个:global()进行包裹，这样就可以改类名样式，且不会被module改变
但是因为是全局的样式，一改就都改了，所以要在前面加一个父类类名

vue里面更改是 v-deep  react里面更改是 :global
*/
